import React from 'react';
import { MailOutlined,OpenAIOutlined } from '@ant-design/icons';
import type { MenuProps } from 'antd';
import { Menu } from 'antd';

type MenuItem = Required<MenuProps>['items'][number];

const items: MenuItem[] = [
  {
    key: 'sub1',
    label: '首页',
    icon: <MailOutlined />,
  },
  {
    key: 'grp',
    label: '内容中心',
    type: 'group',
    children: [
      { key: '13',label: '作品',icon:<OpenAIOutlined /> },
      { key: '14', label: '素材',icon:<OpenAIOutlined /> },
      {key:"15",label:"模版",
        children:[
          {
            key:"16",
            label:"模版商城"
          },
          {
            key:"17",
            label:"我的收藏"
          }
        ]
      },
      {key:'18',label:"文件夹",icon:<OpenAIOutlined />},
      {key:"19",label:"回收站",icon:<OpenAIOutlined />}
    ],
  },
  {key: 'sub9',
    label: '推广中心',
    type: 'group',
    children:[
      {key:"20",label:"获客活码",icon:<OpenAIOutlined />},
      {key:"21",label:"客户群发",icon:<OpenAIOutlined />},
      {key:'22',label:"朋友圈群发",icon:<OpenAIOutlined />},
      {key:"23",label:"智能雷达",icon:<OpenAIOutlined />},
      {key:"24",label:"智能分发",icon:<OpenAIOutlined />},
      {key:"25",label:"全员分发",icon:<OpenAIOutlined />},
      {key:"26",label:"短信通知",icon:<OpenAIOutlined />},
      {key:"27",label:"商品管理",icon:<OpenAIOutlined />},
      {key:"28",label:"个人主页",icon:<OpenAIOutlined />}
    ]
  },
  {
    key: 'ke',
    label: '客户中心',
    type: 'group',
    children:[
      {key:"29",label:"企微客户管理",icon:<OpenAIOutlined />},
      {key:"30",label:"快捷话术",icon:<OpenAIOutlined />},
      {key:"31",label:"加好友自动回复",icon:<OpenAIOutlined />},
      {key:"32",label:"线索客户管理",icon:<OpenAIOutlined />}
    ]
  },
  {
    key: 'tuan',
    label: '团队中心',
    type: 'group',
    children:[
      {key:"33",label:"创建团队",icon:<OpenAIOutlined />}
    ]
  },
  {
    key: 'kuo',
    label: '扩展服务',
    type: 'group',
    children:[
      {key:"创意工具",icon:<OpenAIOutlined />}
    ]
  }
];

const App: React.FC = () => {
  const onClick: MenuProps['onClick'] = (e) => {
    console.log('click ', e);
  };

  return (
    <Menu
      onClick={onClick}
      style={{ width: 200 }}
      defaultSelectedKeys={['1']}
      defaultOpenKeys={['sub1']}
      mode="inline"
      items={items}
    />
  );
};

export default App;